<template>
  <sea-request ref="treeBlock" url="/authority/menu/list" :result-parser="resultParser">
    <el-row slot-scope="{response, reload, loading}">
      <el-col>
        <el-button type="text" @click="reload" class="pull-right" title="刷新菜单列表">
          <i class="fa fa-refresh"></i> 刷新
        </el-button>
      </el-col>
      <el-col>
        <sea-skeleton :data="response" :loading="loading">
          <el-tree ref="tree"
                   node-key="id"
                   default-expand-all
                   :props="{label: 'title'}"
                   :data="response"
                   :show-checkbox="true"
                   :expand-on-click-node="false"></el-tree>
        </sea-skeleton>

        <el-button type="primary" size="small" title="保存菜单栏权限配置" class="pull-right">保存</el-button>
      </el-col>
    </el-row>
  </sea-request>
</template>

<script>

export default {
    name: "GrantMenu",
    components: {},
    props: {
        // 当前需要操作的数据对象
        object: {type: Object, default: undefined},
        // 成功回调，通常是刷新数据表格
        onSucceed: {type: Function, default: undefined}
    },
    watch: {
        object: {
            handler: function (val) {
                if (val !== undefined) {
                    this.$layers.ajax({
                        url: '/authority/menu/list',
                        method: 'GET',
                        params: {roleId: val.id}
                    }).then((result) => {
                        if (result.code === 0) {
                            let list = result.data;
                            let checked = this.$bamboo.getIds(list);
                            this.$refs.tree.setCheckedKeys(checked);
                        }
                    });
                }
            }
        }
    }, methods: {
        /**
         * 查询结果转换为树形结构
         */
        resultParser: function (list) {
            return this.$bamboo.toTree(list);
        }
    }
}
</script>

<style scoped>
</style>